<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>域名审核界面</title>
    <!--1.添加视口标签 快捷方式：meta:vp -->
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"/>
    <!--2.设置网页渲染模式  快捷方式：meta:compat  -->
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
    <!--3.把bootstrap 核心样式（压缩版）引入-->
    <link rel="stylesheet" href="/static/css/bootstrap.min.css"/>
    <style>
        tr th {
            text-align: center;
        }

        .step-links {
            margin-right: 50px;
        }
    </style>
</head>
<body>
<h1 class="text-center">域名审核界面</h1>
<div class="table-responsive">
    <table class="text-center table table-hover table-bordered table-striped table-condensed ">
        {% if contacts %}
            <tr>
                <th>申请人</th>
                <th>申请业务部门</th>
                <th>域名用途</th>
                <th>正式域名</th>
                <th>解析到的IP</th>
                {#            <th>测试</th>#}
                {#            <th>开发</th>#}
                {#            <th>灰度</th>#}
                {#            <th>验收</th>#}
                <th>是否需要https</th>
                <th>申请时间</th>
                <th>申请ID</th>
                {#            <th>解析记录的ID</th>#}
                <th>邮件通知</th>
                <th>审核状态</th>
                <th>是否通过审核</th>

            </tr>

            {% for i in contacts %}
                <tr ip="{{ i.ip }}" id="{{ i.id }}" domain="{{ i.domain }}">
                    <td>{{ i.name }}</td>
                    <td>{{ i.department }}</td>
                    <td>{{ i.use }}</td>
                    <td>{{ i.domain }}</td>
                    <td>{{ i.ip }}</td>
                    {#                <td>beta-{{ i.domain }}</td>#}
                    {#                <td>dev-{{ i.domain }}</td>#}
                    {#                <td>rel-{{ i.domain }}</td>#}
                    {#                <td>check-{{ i.domain }}</td>#}
                    <td>{{ i.https }}</td>
                    <td>{{ i.updatetime|date:"Y-m-d H:i:s" }}</td>
                    <td>{{ i.id }}</td>
                    {#                <td>{{ i.RecordId }}</td>#}
                    <td>
                        <select name="mail">
                            <option value="no">不通知</option>
                            <option value="ok" selected="selected">通知</option>
                        </select>
                    </td>
                    <td>{{ i.Review_status }}</td>

                    <td>
                        <button id="点击通过" class="btn btn-primary">点击通过</button>
                    </td>
                </tr>
            {% endfor %}
        {% else %}
            <h1 class="text-center btn-danger"><b>暂无审核信息</b></h1>
        {% endif %}

    </table>
</div>
<div class="pagination pull-right">
    <span class="step-links text-center">
        {% if contacts.has_previous %}
            <a class="btn btn-primary" href="?page={{ contacts.previous_page_number }}">上一页</a>
        {% endif %}

        <span class="current text-center">
             第{{ contacts.number }} 页,共 {{ contacts.paginator.num_pages }}页.
        </span>

        {% if contacts.has_next %}
            <a class="btn btn-primary" href="?page={{ contacts.next_page_number }}">下一页</a>
        {% endif %}
    </span>
</div>

<!--模态框部分-->
<div class="modal fade" id="myModal">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button class="close" data-dismiss="modal"><span>&times;</span></button>
                <h3 class="modal-title">请确认域名: <span id="Domain"></span> 需要绑定的IP</h3>
            </div>
            <div class="modal-body">
                {#                <form action="" method="post" enctype="multipart/form-data">#}


                <div class="form-group clearfix">
                    <label class="control-label col-md-4 text-right" for="id_域名">此域名绑定的IP为:</label>
                    <div class="col-md-6">
                        <input class="form-control" type="text" name="ip"
                               id="ip" required="">
                    </div>
                </div>


                <div class="modal-footer">
                    <button class="btn btn-primary close-modal" data-dismiss="modal">关闭</button>
                    <button class="btn btn-success 确认" data-dismiss="modal">确认</button>

                </div>

                {#                </form>#}

            </div>

        </div>
    </div>
</div>

<!--4.把jQuery 引入-->
<script src="/static/js/jquery-1.10.2.min.js"></script>
<!--5.把bootstrap 核心脚本文件（压缩版）引入-->
<script src="/static/js/bootstrap.min.js"></script>
<script>
    $(document).ready(function () {
        $("#点击通过").click(function () {
            var _id = $(this).parent().parent().attr("id");
            var select_ = $(this).parent().parent().find('select').find("option:selected").val();
            var ip = $(this).parent().parent().attr('ip');
            var domain = $(this).parent().parent().attr('domain');
            {#            alert(ip)#}
            $(":text[name=ip]").val(ip);
            $('#Domain').html(domain);
            $("#myModal").modal('show');//显示模态框
            $('.确认').click(function () {
                $("#" + _id).remove();
                $.post("", {
                    '_id': _id,
                    "mail": select_,
                    "ip": ip,
                    csrfmiddlewaretoken: '{{ csrf_token }}'
                }, function () {
                    alert('域名为:' + domain + "的记录审核通过了！");
                    history.go(0)
                })
            });

        });

    });
</script>
</body>

</html>